<script type="text/javascript"><!--//--><![CDATA[//><!--

	var grid_reload = function(){
		$('#datagrid').datagrid('reload', $('#fm_search').serializeObject());
	};

	$(document).ready(function() {
		// Setup Datagrid
		$('#datagrid').datagrid({  
			url:gs_path+'/'+controller+'/getdata', 
			queryParams: $('#fm_search').serializeObject(),
			height:340,
			pagination:true,
			columns:[[
				{ field : 'ck', checkbox:true, width: 40, align: 'center' },				
				{ field : '', title : 'No. Bon', width:200, sortable:true },
				{ field : '', title : 'Type Pembayaran', width:200, sortable:true },
				{ field : '', title : 'Voucher Kupon', width:200, sortable:true },
				{ field : '', title : 'Bayar', width:200, sortable:true },
				{ field : '', title : 'Bayar Voucher', width:200, sortable:true },
				{ field : '', title : 'Voucher SHU', width:200, sortable:true },
				{ field : '', title : 'Card No.', width:200, sortable:true },
				{ field : '', title : 'Appr Code', width:200, sortable:true },
			]]
		});
		
		// Setup Form
		$('#form_master').setupForm([
			{ name: 'id_kemasan', type: 'text', size: 'long', maxlength: 10, noempty:true },
			{ name: 'kemasan', type: 'text', size: 'long', maxlength: 100, noempty:true },
			{ name: 'isi', type: 'text', size: 'medium', maxlength: 10, noempty:true }
		]);
		
		
		// Create Dialog
		$('#dialog_container').dialog({
			closed:true,
			modal:true,
			title: '_',
			width:600,
			height:400,
			buttons:[{
				text:'Save',
				iconCls:'icon-save',
				handler:function(){
					$('#form_master').submitForm('/'+controller+'/ajax_post', { onComplete : function(){ $('#dialog_container').dialog('close'); $('#datagrid').datagrid('reload'); }} );
				}
			},{
				text:'Close',
				iconCls:'icon-cancel',
				handler:function(){
					$('#dialog_container').dialog('close');
				}
			}]
		});
		
		
		// Set Action Button
      var buttons = [ 
                        // ----- >> Edit Button
					   //  { label: 'Edit', icon: 'edit', onclick: function() {
					   //      var oSel = $('#datagrid').datagrid('getSelected');
					   //      if (oSel == null) {
					   //          $.messager.alert('&nbsp;', gs_msg_row_unselected, 'warning'); 
					   //      } else {
								// loadPage(gs_path + '/' + controller + '/edit/?no_tagihan_listrik='+urlencode(oSel.no_tagihan_listrik));
					   //      } 
					   //  }},
					    { label: 'Print to Excel', icon: 'print', onclick: function() {
					    	window.location = gs_path + '/isp_print_excel/invoice';
					    }},

						// ----- >> Download Button
						
						// ----- >> SP Button
					    ];
        setAction(buttons);		
		
		$('#fm_search').focusFirst();
	});
//--><!]]></script>

<div id="tb" style="padding:5px;height:auto">
    <div>
        <form id="fm_search" onsubmit="grid_reload(); return false;">
        	<table class="tb_form" style="margin-bottom:0px">
            <tr>
            	<td width="100">Keyword</td>
                <td><input type="text" id="keyword" name="keyword" class="textfield medium" />
                	<a href="#" class="easyui-linkbutton" iconCls="icon-search" onclick="grid_reload(); return false;">Search</a>
                </td>
            </tr>
            </table>
        </form>
    </div>
</div>
<div id="datagrid" toolbar="#tb"></div>


<div id="dialog_container" style="padding:5px;width:600px;height:250px;">
	<form id="form_master">
    <table class="tb_form" style="width:100%;" cellpadding="0" cellspacing="0">
    <tr>
        <td class="label" style="width:150px">No. Bon</td>
        <td><input id="kemasan" /></td>
    </tr>
    <tr>
        <td class="label" style="width:150px">Tipe Pembayaran</td>
        <td><input id="isi" /></td>
    </tr>   
    <tr>
        <td class="label" style="width:150px">Voucher Kupon</td>
        <td><input id="isi" /></td>
    </tr>    
    <tr>
        <td class="label" style="width:150px">Bayar</td>
        <td><input id="isi" /></td>
    </tr>    
    <tr>
        <td class="label" style="width:150px">Bayar Voucher</td>
        <td><input id="isi" /></td>
    </tr>    
    <tr>
        <td class="label" style="width:150px">Bayar SHU</td>
        <td><input id="isi" /></td>
    </tr>   
       <tr>
        <td class="label" style="width:150px">Card No.</td>
        <td><input id="isi" /></td>
    </tr> 
       <tr>
        <td class="label" style="width:150px">Appr Code</td>
        <td><input id="isi" /></td>
    </tr>       
    </table>
	</form>
</div>